<template>
  <div class="div">
    <Header title="个人中心"></Header>
    <div class="kt">
      <van-image round width="50px" height="50px" src="https://img.yzcdn.cn/vant/cat.jpeg" />
      <h3>喵子</h3>
    </div>
    <van-cell title="订单" is-link value="全部订单" @click="qddd(0)" />
    <div class="wg">
      <van-grid column-num="4">
        <van-grid-item text="文字" @click="qddd(1)">
          <img src="@/assets/gerenzx/付款 .png" class="imgwg" />
          <font class="wgzt">待付款</font>
        </van-grid-item>
        <van-grid-item text="文字" @click="qddd(2)">
          <img src="@/assets/gerenzx/收货.png" class="imgwg" />
          <font class="wgzt">待收货</font>
        </van-grid-item>
        <van-grid-item text="文字" @click="qddd(3)">
          <img src="@/assets/gerenzx/评价.png" class="imgwg" />
          <font class="wgzt">待评价</font>
        </van-grid-item>
        <van-grid-item text="文字">
          <img src="@/assets/gerenzx/维修.png" class="imgwg" />
          <font class="wgzt">退换修</font>
        </van-grid-item>
      </van-grid>
      <van-cell title="地址" icon="location-o" @click="dizhi()"/>
      <van-cell title="会员" icon="user-o" />
      <van-cell title="服务" icon="flower-o" />
      <van-cell title="小米之家" icon="wap-home-o" />
      <van-cell title="收藏" icon="star-o" />
      <van-cell title="优惠券" icon="coupon-o" />
      <van-cell title="钱包" icon="balance-o" />
      <van-cell title="设置" icon="setting-o" />
      <van-cell title="更多" icon="qr-invalid" />
    </div>
  </div>
</template>
<script>
import Header from "@/components/Headergl/Header";
import { mapState, mapGetters, mapMutations, mapActions } from "vuex";

export default {
  data() {
    return {};
  },
  methods: {
    ...mapMutations(["xg"]),
    dfk() {
      this.$router.push("/daifukuan");
      this.xg(true);
    },
    qddd(num) {
      this.$router.push("/quanbudingdan/" + num);
      this.xg(true);
    },
    dizhi(){
      this.$router.push("/dizhi");
            this.xg(true);

    }
  },
  components: {
    Header: Header
  },
  computed: {
    ...mapState(["zhuantai"])
  }
};
</script>
<style scoped>
.div {
  margin-top: 40px;
  margin-bottom: 50px;
}
.kt {
  text-align: left;
  height: 25%;
  width: 100%;
  background-color: #54df39;
}
.van-image {
  margin-left: 5%;
  width: 20%;
  margin-top: 5px;
  margin-bottom: 5px;
}
.font {
  text-align: center;
}
h3 {
  float: right;
  margin-right: 60%;
}
.imgwg {
  height: 50%;
  width: 50%;
}
.wgzt {
  font-size: 5px;
  margin-top: 5px;
}

.van-grid-item {
  height: 80px;
}
</style>